<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>怡荭书苑</title>
    <link rel="stylesheet" href="css/common/base.css">
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/libs/swiper-3.4.2.min.css">
    <script>(function flexible(c,b){var h=b.documentElement;var d=c.devicePixelRatio||1;function g(){if(b.body){b.body.style.fontSize=(12*d)+"px"}else{b.addEventListener("DOMContentLoaded",g)}}g();function e(){var i=h.clientWidth/10;h.style.fontSize=i+"px"}e();c.addEventListener("resize",e);c.addEventListener("pageshow",function(i){if(i.persisted){e()}});if(d>=2){var f=b.createElement("body");var a=b.createElement("div");a.style.border=".5px solid transparent";f.appendChild(a);h.appendChild(f);if(a.offsetHeight===1){h.classList.add("hairlines")}h.removeChild(f)}}(window,document));</script>
</head>
<body>
    <div class="index-wrapper">
        <div class="header-wrapper">
            <div class="sex-wrapper inline">
                <div class="female-btn sex-btn inline active pr" data-channel="2">女生<i class="line pa"></i></div>
                <div class="male-btn sex-btn inline pr" data-channel="1">男生<i class="line pa"></i></div>
            </div>
            <div class="search-wrapper inline pr">搜索书城 <i class="pa search-icon"></i></div>
        </div>
        <div class="banner-wrapper">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                </div>
                <div class="swiper-pagination"></div>
            </div>
        </div>
        <p class="split-line-wrapper"></p>
        <div class="tab-wrapper">
            <ul>
                <li class="inline recharge" data-url="./pages/recharge.html">
                    <div></div>
                    <p class="tc">充值</p>
                </li>
                <li class="inline limit" data-url="./pages/special.html">
                    <div></div>
                    <p class="tc">特价</p>
                </li>
                <li class="inline vip" data-url="./pages/rank.html">
                    <div></div>
                    <p class="tc">排行榜</p>
                </li>
                <li class="inline sign" data-url="./pages/sign.html">
                    <div></div>
                    <p class="tc">签到</p>
                </li>
            </ul>
        </div>
        <p class="split-line-wrapper"></p>
        <div class="select-wrapper">
            <div class="left-wrapper inline">
            </div>
            <div class="right-wrapper inline">
                <div class="top-wrapper">
                </div>
                <div class="bottom-wrapper">
                </div>
            </div>
        </div>
        <p class="split-line-wrapper"></p>
        <div class="recommend-wrapper pr">
            <div class="header">
                <div class="title">
                    <i class="title-icon inline"></i><span class="inline">主编推荐</span>
                </div>
            </div>
            <div class="recommend-content">
                <div class="swiper-container">
                    <div class="swiper-wrapper">
                    </div>
                    <div class="swiper-pagination recommend-pagination"></div>
                </div>
            </div>
            <div class="left-mask pa"></div>
            <div class="right-mask pa"></div>
        </div>
        <p class="split-line-wrapper"></p>
        <!--<p class="split-line-wrapper"></p>-->
        <!--<div class="hot-wrapper">-->
            <!--<div class="header clearfix">-->
                <!--<div class="title fl">-->
                    <!--<i class="title-icon inline"></i><span class="inline">劲爆专区</span>-->
                <!--</div>-->
                <!--<div class="more fr" onclick="goMore(3)"><span class="inline">查看更多</span><i class="more-icon inline"></i></div>-->
            <!--</div>-->
            <!--<div class="hot-content same-content">-->
                <!--<ul>-->
                <!--</ul>-->
            <!--</div>-->
        <!--</div>-->
        <p class="split-line-wrapper"></p>
        <!--<div class="limit-wrapper">-->
            <!--<div class="header clearfix">-->
                <!--<div class="title fl">-->
                    <!--<span class="inline">限时免费</span>-->
                    <!--<div class="timer-wrapper inline">-->
                        <!--<i class="timer-icon inline"></i>-->
                        <!--<div class="count-wrapper inline"><span id="hour"></span>:<span id="min"></span>:<span id="sec"></span></div>-->
                    <!--</div>-->
                <!--</div>-->
                <!--<div class="more fr"><span class="inline">查看更多</span><i class="more-icon inline"></i></div>-->
            <!--</div>-->
            <!--<div class="limit-content">-->
                <!--<ul>-->
                <!--</ul>-->
            <!--</div>-->
        <!--</div>-->
        <!--<p class="split-line-wrapper"></p>-->
        <div class="new-wrapper">
            <div class="header clearfix">
                <div class="title fl">
                    <i class="title-icon new-title-icon inline"></i><span class="inline">新书抢鲜</span>
                </div>
                <div class="more fr" onclick="goMore(-1)"><span class="inline">查看更多</span><i class="more-icon inline"></i></div>
            </div>
            <div class="new-content same-content">
                <ul>

                </ul>
            </div>
        </div>
        <p class="split-line-wrapper"></p>
        <div class="like-wrapper">
            <div class="header clearfix">
                <div class="title fl">
                    <i class="title-icon new-title-icon inline"></i><span class="inline">猜你喜欢</span>
                </div>
                <div class="more fr"><span class="inline">换一批</span><i class="more-icon inline"></i></div>
            </div>
            <div class="like-content">
                <ul>
                </ul>
            </div>
        </div>
        <p class="split-line-wrapper"></p>
        <div class="contact-wrapper">

        </div>
        <div class="bottom-nav-wrapper border-1px">
            <ul>
                <li class="inline shelf-li" data-url="./pages/shelf.html">
                    <div class="shelf-icon-wrapper"></div>
                    <p>书架</p>
                </li>
                <li class="inline index-li" data-url="./index.html">
                    <div class="index-icon-wrapper"></div>
                    <p>首页</p>
                </li>
                <li class="inline rank-li" data-url="./pages/classify.html">
                    <div class="rank-icon-wrapper"></div>
                    <p>分类</p>
                </li>
                <li class="inline mine-li" data-url="./pages/mine.html">
                    <div class="mine-icon-wrapper"></div>
                    <p>我的</p>
                </li>
            </ul>
        </div>
        <div class="new-sign-wrapper">
            <div class="new-sign-content pa">
                <div class="new-sign-title tc">新用户豪华登录礼包</div>
                <div class="new-sign-get tc">今日获得<span class="award-coin active"></span><span class="award-gift active"></span>  累计已签到<span class="account active"></span>次</div>
                <ul>

                </ul>
                <div class="confirm-btn tc">确认</div>
            </div>
        </div>
    </div>
    <script src="./js/libs/zepto.min.js"></script>
    <script src="./js/libs/swiper-3.4.2.jquery.min.js"></script>
    <script src="./js/libs/common.js"></script>
    <script src="./js/index.js"></script>
</body>
</html>